{extend name="platform/base" /}
{block name="resources"/}
<style type="text/css">
.dislog-style {
	width: 80%;
	margin: 40px auto;
}

.modal.fade {
	top: 50%;
}

.dislog-style ul {
	width: 100%;
}

.dislog-style ul li span {
	display: inline-block;
	width: 60px;
	text-align: center;
	height: 40px;
	line-height: 31px;
}

.dislog-style ul li input {
	width: 200px;
}
#albumList{
	border-top:1px solid #E3E3E3;
}
#albumList>li:hover {
	background-color: rgb(230, 230, 230);
}

#albumList>li:hover .buttons {
	display: block;
}
.input-file{
	position: absolute;
	top: -10px !important;
	right: 9px !important;
	height: 26px !important;
	width: 94px !important;
	filter: alpha(opacity : 0) !important; 
	opacity: 0 !important;
	line-height:auto;
}
</style>
{/block}
{block name="right_tab"}
	<li><a class="ncsc-btn ncsc-btn-green" style="right: 100px; position: static;" data-toggle="modal" data-target="#addalbum"><i class="fa fa-file-photo-o"></i>创建相册</a></li>
	<li>
		<a id="open_uploader" style="right: 100px; position: static;" class="ncsc-btn ncsc-btn-acidblue">
		<i class="fa fa-cloud-upload"></i>上传图片
		</a>
		<input type="file" id="uploadImg" hidefocus="true" size="1" class="input-file" name="file_upload" multiple="multiple" onchange="imgUpload(this);">
	</li>
	<input type="hidden" id="album_id"value="
	{foreach $album_list as $vo} 
		{if condition="$vo['is_default'] eq '1'"}
			{$vo.album_id}			
		{/if} 
	{/foreach}
	"/>
<!-- <div class="upload-con" id="uploader" style="top: 20px; display: none;">
	<form method="post" action="" id="fileupload"
		enctype="multipart/form-data">
		<div class="upload-con-div">
			选择相册： <select name="album_id" id="album_id" class="select"
				style="width: 90px;"> {foreach $album_list as $vo} {if
				condition="$vo['is_default'] eq '1'"}
				<option value="{$vo.album_id}" class="w80" selected>{$vo.album_name}</option>
				{else /}
				<option value="{$vo.album_id}" class="w80">{$vo.album_name}</option>
				{/if} {/foreach}
			</select>
		</div>
		<div class="upload-con-div">
			图片名称： <input type="text" id="pic_name" value="" style="width: 80px;" />
		</div>
		<div class="upload-con-div">
			图片标签： <input type="text" id="pic_tag" value="" style="width: 80px;" />
		</div>
		<div class="upload-con-div">
			选择文件：
			<div class="ncsc-upload-btn">
				<a href="javascript:void(0);">
					<span><input type="file" id="uploadImg" hidefocus="true" size="1" class="input-file" name="file_upload" multiple="multiple" onchange="imgUpload(this);"><input type="hidden" value="55" /></span>
					<p><i class="icon-upload-alt"></i>上传图片</p>
				</a>
			</div>
		</div>
		<div nctype="file_msg"></div>
		<div class="upload-pmgressbar" nctype="file_loading"></div>
		<div class="upload-txt">
			<span>支持Jpg、Gif、Png格式。</span>
		</div>
	</form>
</div> -->
{/block}{block name="main"}
<table class="mytable">
	<tr>
		<!-- <th>排序方式</th> -->
		<!-- <th width="9%"><select name="sort" id="img_sort"
			style="width: 150px;">
				<option value="4" selected="">按排序从大到小</option>
				<option value="5">按排序从小到大</option>
				<option value="0">按创建时间从晚到早</option>
				<option value="1">按创建时间从早到晚</option>
				<option value="2">按相册名降序</option>
				<option value="3">按相册名升序</option>
		</select></th> -->
		<th width="10%"><input type="text" id='search_text'
			placeholder="请输入相册名称" /><input type="button" onclick="searchData()"
			value="搜索" /></th>
	</tr>
</table>
<div id="pictureIndex" class="ncsc-picture-folder">
	<div class="ncsc-album">
		<ul id="albumList"></ul>
	</div>
</div>
<!-- 相册创建  -->
<div class="modal fade hide" id="addalbum" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">相册创建</h4>
			</div>
			<div class="modal-body">
				<div class="dislog-style">
					<ul>
						<li><span>相册名称</span> <input type="text" value=""
							id="album_name" /></li>
						<li><span>排序</span> <input type="text" value="" id="sort"
							onkeyup='this.value=this.value.replace(/\D/gi,"")' /></li>
						<li style="display: none;"><span>相册封面</span>
							<div class="ncsc-upload-btn" style="margin-top: -1px;">
								<a href="javascript:void(0);">
									<span><input hidefocus="true" size="1" id="uploadPhoto"class="input-file" name="file_upload" id="imgClassSave" nc_type="change_store_label" type="file" onchange="imgUpload(this);"></span>
									<p><i></i>图片上传</p>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-default"
					onclick="addAlbumClass();">创建</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal -->
</div>
<!-- 相册编辑  -->
<div class="modal fade hide" id="editalbum" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">相册创建</h4>
			</div>
			<div class="modal-body">
				<div class="dislog-style">
					<input type="hidden" id="editAlbum_id" value="" />
					<ul>
						<li><span>相册名称</span><input type="text" value="" id="edit_album_name" /></li>
						<li><span>排序</span><input type="text" value="" id="edit_sort" onkeyup='this.value=this.value.replace(/\D/gi,"")' /></li>
						<li><span>相册封面</span>
							<div class="ncsc-upload-btn" style="margin-top: -1px;">
								<a href="javascript:void(0);">
									<span>
										<input hidefocus="true" size="1" class="input-file" name="file_upload" id="imgClassUpdate" nc_type="change_store_label" type="file" onchange="imgClassUpload(this);">
										<input type="hidden" id="editLogo" value="" />
									</span>
									<p><i></i>图片上传</p>
								</a>
							</div>
						</li>
					</ul>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-default" onclick="updateAlbumClass();">修改</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal -->
</div>
<script src="ADMIN_JS/ajax_file_upload.js" type="text/javascript"></script>
{/block}
{block name="script"}
{include file="admin/default/pageCommon"/}
{include file="admin/default/openDialog" /}
<script type="text/javascript">
	//查询用户列表
	function LoadingInfo(pageIndex) {
		var search_text = $("#search_text").val();
		$.ajax({
			type : "post",
			url : "PLATFORM_MAIN/System/albumList",
			async : true,
			data : {
				"pageIndex" : pageIndex,"search_text" : search_text
			},
			success : function(data) {
				$("#page_count").val(data["page_count"]);
				$("#pageNumber a").remove();
				var html = '';
				if (data["data"].length > 0) {
					for (var i = 0; i < data["data"].length; i++) {
						if(i==0||i%5==0){
							html += '<li  style="opacity: 1;border-width:0 1px 1px 1px;"><dl><dt><div class="covers">';
						}else{
							html += '<li  style="opacity: 1;border-width:0 1px 1px 0;"><dl><dt><div class="covers">';
						}
						html += '<a href="PLATFORM_MAIN/System/albumPictureList?album_id='
								+ data["data"][i]["album_id"]
								+ '&&album_name='
								+ data["data"][i]["album_name"]
								+ '">';
						if(data["data"][i]["album_cover"] == ''){
							html += '<i class="icon-camera-retro"></i>';	
						}else{
							html += '<i class=""><img src="__ROOT__/'+data["data"][i]["pic_info"]["pic_cover"]+'"/></i>';
						}
						html += '</a></div>';
						html += '<h3 class="title"><a href="">'
								+ data["data"][i]["album_name"]
								+ '</a></h3></dt><dd class="date">共'+data["data"][i]["pic_count"]+'张</dd>';
						html += '<dd class="buttons"><span nc_type="dialog" dialog_title="编辑相册" dialog_id="album_1" dialog_width="480" uri="">';
						html += '<a href="JavaScript:void(0);" onclick="editBoxShow('
								+ data["data"][i]["album_id"]
								+ ');"><i class="icon-pencil"></i>编辑</a></span>';
						if (data["data"][i]["is_default"] != 1) {
							html += '<a href="javascript:void(0)" onclick="deleteAlbumClass('
									+ data["data"][i]["album_id"]
									+ ')"><i class="icon-remove-sign"></i>删除</a>';
						}
						html += '</dd></dl></li>';
					}
				} else {
					html += '暂无符合条件的数据记录';
				}
				$("#albumList").html(html);
				var totalpage = $("#page_count").val();
				if (totalpage == 1) {
					changeClass("all");
				}
				var $html = pagenumShow(jumpNumber,totalpage,{$pageshow})
				$("#pageNumber").append($html);			
			}
		});
	}
	function searchData(){
		LoadingInfo(1);
	}

	/**
	 * 创建相册
	 */
	function addAlbumClass() {
		var album_name = $("#album_name").val();
		var sort = $("#sort").val();
		var album_cover = $("#addLogo").val();
		$.ajax({
			type : "post",
			url : "PLATFORM_MAIN/System/addAlbumClass",
			async : true,
			data : {
				"album_name" : album_name,
				"sort" : sort,
				"album_cover" : album_cover
			},
			success : function(data) {				
				if (data['code'] > 0) {
					LoadingInfo();
					showMessage('success', data["message"],"PLATFORM_MAIN/System/albumList");
					$("#addalbum").modal('hide');
				}else{
					showMessage('error', data["message"]);
				}
			}
		})
	}
	/**
	 * 弹出编辑页面
	 */
	function editBoxShow(album_id) {
		$('#editalbum').modal(show);
		$("#editAlbum_id").val(album_id);
		/* 	var detailArray = getAlbumClassDetail(album_id); */
		$.ajax({
			type : "post",
			url : "PLATFORM_MAIN/System/getAlbumClassDetail",
			async : false,
			data : {
				"album_id" : album_id
			},
			success : function(data) {
				if (data) {
					$("#edit_album_name").val(data.album_name);
					$("#edit_sort").val(data.sort);
					$("#editLogo").val(data.album_cover);
				}
			}
		})
/* 		$("#edit_album_name").val(detailArray.album_name);
		$("#edit_sort").val(detailArray.sort); */

	}
	/**
	 * 删除相册
	 */
	function deleteAlbumClass(aclass_id_array) {
		$( "#dialog" ).dialog({
            buttons: {
                "确定,#e57373": function() {
                    $(this).dialog('close');
                    $.ajax({
            			type : "post",
            			url : "PLATFORM_MAIN/System/deleteAlbumClass",
            			async : true,
            			data : {
            				"aclass_id_array" : aclass_id_array
            			},
            			success : function(data) {
							if(data['code'] > 0){
								LoadingInfo();
								showMessage('success', data['message']);
        					}else{
        						showMessage("error",data['message']);
        					}
            			}
            		})
                },
                "取消": function() {
                    $(this).dialog('close');
                }
            },
            contentText:"删除相册?\n注意：相册内的图片将转移到默认相册",
        });
		/* if (!confirm('删除相册?\n注意：相册内的图片将转移到默认相册')) {
			return false;
		}
		 */
	}	
	/**
	 * 修改相册
	 */
	function updateAlbumClass() {
		var album_name = $("#edit_album_name").val();
		var sort = $("#edit_sort").val();
		var album_id = $("#album_id").val();
		var album_cover = $("#editLogo").val();
		$.ajax({
			type : "post",
			url : "PLATFORM_MAIN/System/updateAlbumClass",
			async : true,
			data : {
				"album_name" : album_name,
				"sort" : sort,
				"album_id" : album_id,
				"album_cover" : album_cover
			},
			success : function(data) {
				if (data['code'] > 0) {
					LoadingInfo();
					showMessage('success', data['message']);
					$("#editalbum").modal('hide');
				}else{
					showMessage("error",data['message']);
				}
			}
		})
	}
	/**
	 *图片上传
	 */
	function imgUpload(event) {
		var fileid = $(event).attr("id");   var str = $(event).next().attr("id");
		var album_id = Number($("#album_id").val());
		$.ajaxFileUpload({
			url : 'PLATFORM_MAIN/System/File_Upload', //用于文件上传的服务器端请求地址
			secureuri : false, //一般设置为false
			fileElementId : fileid, //文件上传空间的id属性  <input type="file" id="file" name="file" />
			dataType : 'text', //返回值类型 一般设置为json
			data : {
				"album_id" : album_id,
				"type" : "1,2,3,4"
			},
			async : false,
			contentType : "text/json;charset=utf-8",
			success : function(data) //服务器成功响应处理函数
			{
				if (data > 0) {
					LoadingInfo();
					showMessage('success', "上传成功");
				}else{
					showMessage('error', "上传成功");
				}		
				/* if (res) {									
					alert("上传成功");
				} */
			}
		});
	}
	/**
	 *相册图片上传
	 */
	function imgClassUpload(event) {
		var fileid = "imgClassUpdate";
		var album_id = $("#editAlbum_id").val();
		$.ajaxFileUpload({
			url : 'PLATFORM_MAIN/System/File_Upload', //用于文件上传的服务器端请求地址
			secureuri : false, //一般设置为false
			fileElementId : fileid, //文件上传空间的id属性  <input type="file" id="file" name="file" />
			dataType : 'text', //返回值类型 一般设置为json
			data : {
				"pic_name" : "相册封面",
				"pic_tag" : "相册封面",
				"album_id" : album_id,
				"type" : "1,2,3,4"
			},
			async : false,
			contentType : "text/json;charset=utf-8",
			success : function(data) //服务器成功响应处理函数
			{
				if (data > 0) {
					LoadingInfo();
					$("#imgClassUpdate").next().val(data);
					$( "#dialog" ).dialog({				
			            buttons: {
			                "确定,#e57373": function() {
			                    $(this).dialog('close');
			                }
			            },
			            contentText:"图片上传成功",
			      		time:3,
			        });
				}else{
					$( "#dialog" ).dialog({				
			            buttons: {
			                "确定,#e57373": function() {
			                    $(this).dialog('close');
			                }
			            },
			            contentText:"图片上传失败"
			        });
				}
			}
		});
	}
	/**
	 *添加图片框体切换
	 */
	function addImgBox() {
		if ($("#uploader").is(":hidden")) {
			$("#uploader").show();
		} else {
			$("#uploader").hide();
		}
	}	
</script>
<div id="append_parent"></div>
{/block}